<template>
	<view class="index_seach">
		<view class="index_input">
			<img class="seach_img" src="../static/seach.png" alt="" srcset="" />
			<input type="text" confirm-type="search" @confirm="doSearch" v-model="seachVal" placeholder="请输入"
				placeholder-class="pla" />
			
		
		</view>
	</view>
</template>

<script>
	export default {
		name:"vue",
		data() {
			return {
				indexSelect: 0,
				arraySelect: ['搜作者', '搜诗句', '搜诗名'],
				seachVal:"",
				types:""
			};
		},
		methods:{
			doSearch() {
				if (!this.seachVal) {
					this.types=3;
				}
				this.$emit('searchFn',this.seachVal)
				
			},
			
		}
	}
</script>

<style lang="scss">

		.index_seach {
			height: 50px;
			width: 100%;
			background-color: #7d8468;

			.index_input {
				width: 97%;
				height: 50px;
				margin: auto;
				display: flex;
				align-items: center;
				position: relative;

				input {
					height: 28px;
					border-radius: 20px;
					width: 100%;
					background-color: #fff;
					padding-left: 25px;
					font-size: 14px;
				}

				.seach_img {
					width: 32px;
					position: absolute;
					height: 32px;
				}
				
				.pikerimg {
					width: 20px;
				
					height: 20px;
				}
				
				.seachType {
					position: absolute;
					right: 0px;
					font-size: 26rpx;
					color: #6d6d6d;
					width: 65px;
					height: 28px;
					line-height: 27px;
					background: #f5f5f5;
					border-radius: 0 20px 20px 0;
					text-align: center;
					display: flex;
					padding-left: 10rpx;
					align-items: center;
					z-index: 10000;
				}

				.pla {
					padding-left: 30px;
					font-size: 14px;
				}

			}
		}
		
</style>